<!--
  To change this template, choose Tools | Templates
  and open the template in the editor.
-->

<%@ page contentType="text/html;charset=UTF-8" %>

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="layout" content="main"/>
	<title>Album informacion</title>
          <script type="text/javascript">

                  function mostrarcancion(){
	
                      $('#canci_invisible').show(1500);
                 }
                   function guardarcancion(){
	
                      $('#canci_invisible').hide(1500);
                 }

           </script>
  </head>
  <body>

 <!-- ----------------------------------------------------------------------------------------------- -->       
	<div id="fotoPerfil">	
          <br><br>
           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img style="width:350px; height:400px;" src="${createLink(controller:"artista" ,action:'imagen', id:"${albumInstance.imagenA.id}")}" />
        </div>
         <div id= "nom">&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;
            <br><br><br><br><br><br><label id="fuenteNombreAl">${albumInstance.nombreA}</label><br>
         </div>
         
          <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
          <div id="infoGeneral1">
            <label id="fuenteTitulo1">&nbsp;&nbsp;&nbsp;&nbsp;Fecha de Lanzamiento:&nbsp;&nbsp;&nbsp;</label>
           <label id="fuenteCuerpo1">${albumInstance.fechaLanzamiento}</label><br>
           <label id="fuenteTitulo1">&nbsp;&nbsp;&nbsp;&nbsp;Género:&nbsp;&nbsp;&nbsp;</label>
           <label id="fuenteCuerpo1">${albumInstance.genero}</label><br>
           <label id="fuenteTitulo1">&nbsp;&nbsp;&nbsp;&nbsp;Valoración:&nbsp;&nbsp;&nbsp;</label>
           <label id="fuenteCuerpo1">${albumInstance.valoracion}</label><br>
           <label id="fuenteTitulo1">&nbsp;&nbsp;&nbsp;&nbsp;Descripción:&nbsp;&nbsp;&nbsp;</label>
           <label id="fuenteCuerpo1">${albumInstance.descripcion}</label><br>
          </div>         
  <g:each in="${listCanciones}">
      <label id="letrainformacionartista1" >#Id = ${it.id}  Nombre: ${it.nombreC}&nbsp;&nbsp;&nbsp;  Valoracion: ${it.valoracion}</label> &nbsp;&nbsp;&nbsp;
      <a href="#"  onclick="mostrarLetra()">Letra de cancion</a>&nbsp;&nbsp;&nbsp;
     
      <object type="application/x-shockwave-flash" data="http://help-4-pwg.99k.org/Alls/5758ddewplayer.swf?mp3=/MusgoSoft/home/musicareproduccion/${it.id}"  width="200" height="20" id="dewplayer">
        <param name="wmode" value="transparent" />
        <param name="movie" value="http://help-4-pwg.99k.org/Alls/5758ddewplayer.swf?mp3=/MusgoSoft/home/musicareproduccion/${it.nombreC}" /></object>
   &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <label id="letrainformacionartista1" >Votar:</label>
     <ul class="star-rating">
	<li><a class="one-star" title="Valora 1 estrella de 5" href="/MusgoSoft/Cancion/puntuar/${it.id}?valor=1&albumid=${albumInstance.id}">1</a></li>   <!--pasa el valo dela id dela cancion y el valor 1 de la estrella-->
	<li><a class="two-stars" title="Valora 2 estrellas de 5" href="/MusgoSoft/Cancion/puntuar/${it.id}?valor=2&albumid=${albumInstance.id}">2</a></li>
	<li><a class="three-stars" title="Valora 3 estrellas de 5" href="/MusgoSoft/Cancion/puntuar/${it.id}?valor=3&albumid=${albumInstance.id}">3</a></li>
	<li><a class="four-stars" title="Valora 4 estrellas de 5" href="/MusgoSoft/Cancion/puntuar/${it.id}?valor=4&albumid=${albumInstance.id}">4</a></li>
	<li><a class="five-stars" title="Valora 5 estrellas de 5" href="/MusgoSoft/Cancion/puntuar/${it.id}?valor=5&albumid=${albumInstance.id}">5</a></li>
</ul><br>
    
    
  </g:each>
<!-- ---------------------------------------------------------------------------------------------------- -->

  
<br><br><br>
       <g:if test="${session.nick ==artista.nick}">
        
          <div id="button-box">  
              <g:link class="button" controller="cancion" action="create" params="[ide:"${albumInstance.id}"]">Adicionar una cancion</g:link>
              <a href="#" class="button" onclick="mostrarcancion()"> Editar cancion  </a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
              <g:link class="button"  action="edit" id="${albumInstance?.id}" >Editar Album</g:link>
            </div>
        
       </g:if>
    <img id="top" src="/MusgoSoft/images/imgProyecto/top.png" alt="">	
<div id="canci_invisible"> <!-- formulariocancion -->
	
		<h1><a>Untitled Form</a></h1>
		<g:form id="form_cancion" class="appnitro"  method="post" controller="cancion" action="edit">
			<div class="form_description">
			<h2> </h2>
                        <p>Ingrese el numero de identificacion #id de la cancion que quiere editar</p>
		</div>						
			<ul >
			
		<li id="li_1" >
		<label class="description" for="element_1">Id cancion </label>
		<div>
			<input id="element_1" name="idcancion" class="element text medium" type="text" maxlength="255" value=""/> 
		</div> 
		</li>		
			<g:hiddenField name="ide" value="${albumInstance?.id}" />
			<g:hiddenField name="editcancion" value="true" />	
			    
		<g:actionSubmit value="Editar" action="edit"/>
                <input name="cancelar" type="button" value="Cancelar" onclick="guardarcancion()" />
                               
		</li>
			</ul>
                </g:form>	
		
	</div><!-- formulario cancion-->	
	<img id="bottom" src="/MusgoSoft/images/imgProyecto/bottom501.png" alt="">		
	 	
  </body>
</html>